<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>基本设置</title>
	<link rel="stylesheet" href="/js/plugin/layui-v2.3.0/layui/css/layui.css">
	<link rel="stylesheet" href="/css/reset.css">
	<link rel="stylesheet" href="/css/index.css">
	<link rel="stylesheet" href="/css/project_set.css">
	<script src="/js/jquery-2.1.1.min.js"></script>
	<script src="/js/plugin/layui-v2.3.0/layui/layui.js"></script>
	<script src="/js/common.js"></script>
</head>
<script>
$(document).ready(function() {
	
	if($("#userSexId").val()==1){
		$(":radio[name='userSex'][value='1']").attr("checked","checked");  
	}else{
		$(":radio[name='userSex'][value='0']").attr("checked","checked");  
	}
})
</script>
<style>
	body,html{
		height: auto; 
	}
	.my-line .layui-inline{
		vertical-align: top
	}
	#testName2{
	margin-top:20px;
}
#testName2>dl{
	margin-right: 15px;
    margin-bottom: 15px;
    display:inline-block;
}
#testName2 .layui-upload-img{
	width:100px;
	height:100px;
}
.img-del{
    position: absolute;
    text-align: center;
    line-height: 16px;
    display:none;
    top: -6px;
    right: -6px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border: 1px solid #e6e6e6;
    background-color: #ffffff;
    cursor: pointer;
    font-weight:600;
}
#testName2>dl:hover .img-del{
	display:block
}
</style>
<body>
<input type="hidden" id="userSexId" name="userSexId" th:value="${user.userSex}" />
	<div class="nav-section-content-container" style="padding: 0px">
					<header class="nav-header">
						<div class="nav-section-header-title">
							<span>个人信息</span>
						</div>
					</header>
					<div class="kb-form-container">
						<form class="layui-form" id="defaultForm" th:action="@{/system/org/user/update}" th:method="post" lay-filter="employee-form">
						<fieldset class="fieldset">
							<legend>基本信息</legend>
								<input type="hidden" id="id" name="id" th:value="${user.id}" />
								<div>
									<div class="layui-form-item layui-form-text">
									    <label class="layui-form-label">姓名</label>
									    <div class="layui-input-block" style="padding-right: 25px">
									      <input type="tel" name="userName" lay-verify="userName" autocomplete="off" th:value="${user.userName}" class="layui-input" placeholder="">
									    </div>
									</div>
									<div class="layui-form-item layui-form-text">
									    <label class="layui-form-label">性别</label>
									    <div class="layui-input-block" style="padding-right: 25px">
									        <input type="radio" name="userSex" value="1" title="男">
		      								<input type="radio" name="userSex" value="0" title="女">
									    </div>
									</div>
									<div class="layui-form-item layui-form-text">
									    <label class="layui-form-label">职位</label>
									    <div class="layui-input-block" style="padding-right: 25px">
									      <input type="tel" name="post" lay-verify="post" autocomplete="off" th:value="${user.post}" class="layui-input" placeholder="">
									    </div>
									</div>
									<div class="layui-form-item layui-form-text">
									    <label class="layui-form-label">联系电话</label>
									    <div class="layui-input-block" style="padding-right: 25px">
									      <input type="tel" name="phoneNumber" lay-verify="phoneNumber" autocomplete="off" th:value="${user.phoneNumber}" class="layui-input" placeholder="">
									    </div>
									</div>
								</div>
							</fieldset>
						<fieldset class="fieldset">
							<legend>上传头像</legend>
								<div>
									<label class="layui-form-label">
										<div id="testName2">
											<dl th:id="${user.sysAttachmentPortrait.id}" th:if="${user.sysAttachmentPortrait!=null}" >
								    			<dt style="position: relative;">
								    				<img th:src="|${user.sysAttachmentPortrait.filePath}${user.sysAttachmentPortrait.id}${user.sysAttachmentPortrait.fileType}|" class="layui-upload-img">
								    				<div class="img-mask"></div>
								    				<span class="img-del" th:id="${user.sysAttachmentPortrait.id}" onclick="delt(this)"><i class="glyphicon glyphicon-trash">×</i></span>	
								    			</dt>
								    			<dd style="padding-right:10px;line-height:16px">
								    				<input type="hidden" id="fileId" name="fileId" th:value="${user.sysAttachmentPortrait.id}" />
										    		
								    			</dd>
								    			
									    	</dl>
											</div>
										</label>
										
										<div class="layui-input-block">
										&nbsp;&nbsp;&nbsp;&nbsp;
										  	<button type="button" class="layui-btn layui-btn-normal" id="test2">上传场地照片</button>
										  	<br>&nbsp;&nbsp;&nbsp;&nbsp;
										  	<span style="color: rgb(153, 153, 153); font-size: 12px; padding: 4px 0px 0px;">图片大小至少为232x134, 选择jpg, jpeg, 或png文件</span>
											
										</div>
									<input type="hidden" id="sysAttachmentPortraitId" name="sysAttachmentPortraitId" th:if="${user.sysAttachmentPortrait!=null}" th:value="${user.sysAttachmentPortrait.id}" />
									<input type="hidden" id="sysAttachmentPortraitId" name="sysAttachmentPortraitId" th:if="${user.sysAttachmentPortrait==null}"/>
								</div>
							</fieldset>
						
						<fieldset class="fieldset">
							<div class="layui-form-item">
								<button class="layui-btn layui-btn-normal btn-bg" lay-submit lay-filter="formEmployee" id="submit-btn">保存</button>
							</div>
						</fieldset>
						</form>
					</div>
				</div>
</body>
<script>
$(function(){
	setHeight();
    layui.config({
        base: '/js/plugin/layui-v2.3.0/layui/' //此处路径请自行处理, 可以使用绝对路径
    }).extend({
        formSelects: 'formSelects-v3'
    }).use(['element',"layer","form",'formSelects','upload'], function(){
		var layer=layui.layer,form = layui.form,formSelects = layui.formSelects,upload = layui.upload;
		//上传
		layui.use('upload', function(){
			var $ = layui.jquery
			,upload = layui.upload;
			
			 upload.render({
				    elem: '#test2'
				    ,url: "/common/upload/add/"+$("#id").val()
				    ,size: 0
				    ,accept: 'file' //普通文件
				    ,done: function(res, index, upload){
				      //上传完毕
				      	//layer.msg("只能上传一个文件，再次上传将覆盖！");
				    	$("#sysAttachmentPortraitId").val(res.id);
				    	$('#testName2').html('<dl id="'+res.id+'"><dt style="position: relative;"><img src="'+ res.sqlPath + res.id + res.extName +'" class="layui-upload-img"><div class="img-mask"></div><span class="img-del" id="'+res.id+'" onclick="delt(this)"><i class="layui-icon">&#x1006;</i></span></dt><dd style="padding-right:10px;line-height:16px"><input type="hidden" id="fileId" name="fileId" value="'+res.id+'" /><div class="img-tip"></div></dd></dl>')
				    	setHeight();
				    }
			  });
		});
		
		form.verify({
			projectName: function(value, item){ //value：表单的值、item：表单的DOM对象
	      	  if(value==""){
		       	  return '分店名称不能为空';
		      }
		  }
		  
		  
		}); 
		//监听提交
		  form.on('submit(formEmployee)', function(data){
			  $.post($("#defaultForm").attr('action'), data.field, function(result) {
					layer.msg(result.msg);
				}, 'json');
				return false;
		  });
		
	});
})

function setHeight(){
    var h = document.body.clientHeight;
    window.parent.setiframeWrap(h);
}
</script>
</html>